Xceed DataGrid for WPF v7.2 Documentation
Creating Custom Cell Editors
Welcome to Xceed DataGrid, Editors, and 3D Views for WPF v7.2 > Xceed DataGrid for WPF > Code Snippets > Creating Custom Cell Editors

The following page provides a list of examples that demonstrate how to create custom cell editors. For more cell editor-related information, refer to the Cell Editors topic.

All examples in this topic assume that the grid is bound to the Orders table of the Northwind database, unless stated otherwise.

Providing a simple cell editor

The following examples demonstrates how to change the edit template of the cell editor for the ShipVia column to a Slider control.

XAML
Copy Code 
<Grid xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid">
  <Grid.Resources>
    <xcdg:DataGridCollectionViewSource x:Key="cvs_orders"
                                    Source="{Binding Source={x:Static Application.Current},
                                                      Path=Orders}"/>
  </Grid.Resources>
  <xcdg:DataGridControl x:Name="OrdersGrid"
                        ItemsSource="{Binding Source={StaticResource cvs_orders}}">
    <xcdg:DataGridControl.Columns>
     <xcdg:Column FieldName="ShipVia">
       <xcdg:Column.CellEditor>
         <xcdg:CellEditor>
           <xcdg:CellEditor.EditTemplate>
             <DataTemplate>
               <Slider Value="{xcdg:CellEditorBinding}" Minimum="1" Maximum="3"/>
             </DataTemplate>
           </xcdg:CellEditor.EditTemplate>
           <xcdg:CellEditor.ActivationGestures>
             <xcdg:KeyActivationGesture Key="Right"/>
             <xcdg:KeyActivationGesture Key="Left"/>
           </xcdg:CellEditor.ActivationGestures>
         </xcdg:CellEditor>
       </xcdg:Column.CellEditor>
     </xcdg:Column>
    </xcdg:DataGridControl.Columns>
  </xcdg:DataGridControl>
</Grid>

Providing a complex cell editor

The following example demonstrates how to change the edit template of the cell editor for the Freight column to a custom calculator control. The C# code for the Calculate method called in the buttons' Click event simply calculates the new equation and is not provided. To shorten the code, some of the Button and KeyActivationGesture declarations have been removed.

XAML
Copy Code 
<Grid xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid">
  <Grid.Resources>
    <xcdg:DataGridCollectionViewSource x:Key="cvs_orders"
                                    Source="{Binding Source={x:Static Application.Current},
                                                      Path=Orders}"/>
  </Grid.Resources>
   <xcdg:DataGridControl x:Name="OrdersGrid"
                         ItemsSource="{Binding Source={StaticResource cvs_orders}}">
      <xcdg:DataGridControl.Columns>
        <xcdg:Column FieldName="Freight">
           <xcdg:Column.CellEditor>
              <xcdg:CellEditor>
                 <xcdg:CellEditor.EditTemplate>
                    <DataTemplate>
                        <DockPanel>
                           <TextBlock x:Name="actual_value"
                                     Text="{xcdg:CellEditorBinding}"
                                      DockPanel.Dock="Top"/>
                           <UniformGrid Columns="4" x:Name="parentPanel"
                                        Tag="{Binding ElementName=actual_value,
                                                      Path=Text,
                                                      Mode=TwoWay,
                                                      UpdateSourceTrigger=PropertyChanged}"
                                        Button.Click="Calculate"
                                        DockPanel.Dock="Top">
                              <Button x:Name="seven" Content="7"/>
                              <!-- ... -->
                              <Button x:Name="addition" Content="+"/>
                           </UniformGrid>
                           <TextBlock x:Name="current_equation" DockPanel.Dock="Bottom"/>
                         </DockPanel>
                     </DataTemplate>
                 </xcdg:CellEditor.EditTemplate>
                 <xcdg:CellEditor.ActivationGestures>
                    <xcdg:KeyActivationGesture Key="NumPad0"/>
                    <!-- ... -->
                    <xcdg:KeyActivationGesture Key="NumPad9"/>
                 </xcdg:CellEditor.ActivationGestures>
              </xcdg:CellEditor>
           </xcdg:Column.CellEditor>
        </xcdg:Column>
      </xcdg:DataGridControl.Columns>
   </xcdg:DataGridControl>
</Grid>

Providing a default cell editor

The following example demonstrates how to provide a default cell editor for columns that have an Int32 data type.

XAML
Copy Code 
<Grid xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid"
      xmlns:s="clr-namespace:System;assembly=mscorlib">
  <Grid.Resources>
    <xcdg:DataGridCollectionViewSource x:Key="cvs_orders"
                                    Source="{Binding Source={x:Static Application.Current},
                                                      Path=Orders}"/>
  </Grid.Resources>
  <xcdg:DataGridControl x:Name="OrdersGrid"
                        ItemsSource="{Binding Source={StaticResource cvs_orders}}">
   <xcdg:DataGridControl.DefaultCellEditors>
     <xcdg:CellEditor x:Key="{x:Type s:Int32}">
       <xcdg:CellEditor.EditTemplate>
         <DataTemplate>
           <Slider Value="{xcdg:CellEditorBinding}"/>
         </DataTemplate>
       </xcdg:CellEditor.EditTemplate>
     </xcdg:CellEditor>
   </xcdg:DataGridControl.DefaultCellEditors>
  </xcdg:DataGridControl>
</Grid>
 

 

 

Copyright Xceed Software Inc

Send Feedback